<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	这是个html界面
	<p class="just_p">原来的内容</p>

	<ul class="ul-array">
		<li style="border:thin solid red;width:30%;">	
			<img alt="" src="//nodejs.one-zero.space/upload/16541805159209bwtfu1z975/JPG367015.jpg">
			<p>我是个蛋糕</p>
			<p>价格</p></li>
		</li>

	</ul>


	<p>
		<button onclick="doMy()">我的按钮</button>

		<button onclick="cha()">这里是个按钮</button>
	<table class="da-table">
		<tr>
			<td>aabc</td>
			<td>aabc</td>
			<td>aabc</td>
			<td>aabsssc</td>
			<td>aabc</td>
			<td>aabc</td>
		</tr>
		<tr>
			<td>aabc</td>
			<td>aabc</td>
			<td>aabc</td>
			<td>aabsssc</td>
			<td>aabc</td>
			<td>aabc</td>
		</tr>

	</table>
	<div class="da-table"></div>
</body>
<script type="text/javascript">
	function doMy() {
		document.querySelector('.just_p').innerHTML = new Date()
		var uls = document.querySelector(".ul-array")
		
		for(var i = 0 ;i < 10; i++){
			li = uls.firstChild.nextSibling.cloneNode(true)
			console.debug(".......uls.....", li.firstChild.nextSibling )
			li.firstChild.nextSibling.src = '//nodejs.one-zero.space/upload/165536265620720f4sq5hf4s/JPG357541.jpg'
			li.lastChild.innerHTML = "价格 : ￥100" + i + "00.00"
			uls.appendChild(li)

		}

	}

	var rs = {};
	function cha() {
		console.debug("...这里点击了按钮....")
		document.getElementById('just_p').innerHTML = '这里是个改变'

		ta = document.querySelectorAll(".da-table")[0]
		//console.debug('.......找元素.....',)
		ta.childNodes[1].childNodes[0].innerHTML = '<td>我要的内容</td> <td>aabc</td><td>aabc</td><td>aabsssc</td><td>aabc</td><td>aabc</td>'
		//1、创建xmlhttprequest对象
		var xhr = new XMLHttpRequest();
		//2、.open(type,url/file,async)
		xhr.open('GET', '/demo/list', true);

		//3、两种请求方式onload/onreadystatechange
		// xhr.onload = function(){
		//     console.log(this.responseText);
		// }

		xhr.onreadystatechange = function() {
			if (this.status == 200 && this.readyState == 4) {
				eval('rs =' + this.responseText)
				for (var i = 0; i < rs.list.length; i++) {
					ta = document.querySelectorAll(".da-table")[0]
					console.debug('...返回是....', rs.list[i].NAME);
					ta.childNodes[1].childNodes[0].innerHTML = '<td>' + rs.list[i].NAME + '</td> <td>aabc</td><td>aabc</td><td>aabsssc</td><td>aabc</td><td>aabc</td>'

				}
			} else if (this.status == 404) {
				console.log("请求的页面不存在");
			}
		}
		//4、发送请求
		xhr.send();
	}
</script>
</html>